<style lang="less">
  .item1{
    height: 42px;
    line-height: 40px;
  }
  .row-left{
    text-align: center;
  }
  .title{
    margin-bottom:10px;
    color: #1C86EE;
    font-size: 1rem;
    border-bottom: 1px solid orangered;
    font-size: 20px;
    color: coral;
  }
  .content2{
    background-color:white;
    height: auto;
    // border: 1px solid gray;
  }
  .idCard{
    width: 170px;
    height: 80px;
    background-color: #79e428;
    position: absolute;
    right: 2%;
    top: 13%;
    color: white;
    font-size: 1.5rem;
    line-height: 80px;
    text-align: center;
  }
  .red-name{
    color: red
  }
</style>
<template>
  <div style="background-color:white;height:auto">
    <div style="">
      <Row class="title">
        <Col span="4" style="text-align: left;width:22%">城市低保救助申请登记</Col>
      </Row>
    </div>
    <Steps :current="11" class="step-item" style="margin-bottom:10px">
      <Step title="家庭信息" content=""></Step>
      <Step title="家庭成员" content=""></Step>
      <Step title="基础收入" content=""></Step>
      <Step title="基础支出" content=""></Step>
      <Step title="赡抚扶养" content=""></Step>
      <Step title="基础财产" content=""></Step>
      <Step title="财产房产" content=""></Step>
      <Step title="工作单位" content=""></Step>
      <Step title="教育情况" content=""></Step>
      <Step title="家庭附件" content=""></Step>
      <Step title="分类资助" content=""></Step>
      <Step title="低保救助" content=""></Step>
    </Steps>
    <div class="content2">
      <Form ref="paramData" label-position="right" :model="paramData" :rules="ruleValidate">
        <Row class="item1">
          <Col span="3" offset="1" style="text-align: center" class="">家庭人员信息: </Col>
          <Col span="16">
            <Input v-model="hostname" placeholder=""></Input>
          </Col>
        </Row>
        <Row class="item1">
          <Col span="3" offset="1" style="text-align: center" class="">家庭月基础收入金额:</Col>
          <Col span="6">
            <Input v-model="hostname" placeholder=""></Input>
          </Col>
          <Col span="3" offset="1" style="text-align: center" class="">家庭月赡抚养费金额:</Col>
          <Col span="6">
            <Input v-model="hostname" placeholder=""></Input>
          </Col>
        </Row>
        <Row class="item1">
          <Col span="3" offset="1" style="text-align: center" class="">家庭月财产收入金额:</Col>
          <Col span="6">
            <Input v-model="paramData.ssbg0005" placeholder=""></Input>
          </Col>
          <Col span="3" offset="1" style="text-align: center" class="">家庭月基础支出金额:</Col>
          <Col span="6">
            <Input v-model="paramData.ssbg0001" placeholder=""></Input>
          </Col>
        </Row>
        <Row class="item1">
          <Col span="3" offset="1" style="text-align: center" class="">家庭月总收入金额:</Col>
          <Col span="6">
            <Input v-model="paramData.ssbg0002" placeholder=""></Input>
          </Col>
          <Col span="3" offset="1" style="text-align: center" class="">家庭人口数:</Col>
          <Col span="6">
            <Input v-model="paramData.ssbg0005" placeholder=""></Input>
          </Col>
        </Row>
        <Row class="item1">
          <Col span="3" offset="1" style="text-align: center" class="">保障标准:</Col>
          <Col span="6">
            <Input v-model="paramData.ssbg0005" placeholder=""></Input>
          </Col>
          <Col span="3" offset="1" style="text-align: center" class="">差额保障金额:</Col>
          <Col span="6">
            <Input v-model="paramData.ssbg0005" placeholder=""></Input>
          </Col>
        </Row>
        <Row class="item1">
          <Col span="3" offset="1" style="text-align: center" class="">分类救助上浮总金额:</Col>
          <Col span="6">
            <Input v-model="paramData.ssbg0011" placeholder=""></Input>
          </Col>
          <Col span="3" offset="1" style="text-align: center" class="">高龄补贴总金额:</Col>
          <Col span="6">
            <Input v-model="paramData.ssbg0011" placeholder=""></Input>
          </Col>
        </Row>
        <Row class="item1">
          <Col span="3" offset="1" style="text-align: center" class="">总保障金额:</Col>
          <Col span="6">
            <Input v-model="paramData.ssbg0012" placeholder=""></Input>
          </Col>
          <Col span="12" style="text-align: center" class="red-name">（总保障金额=差额保障金额+分类救助上浮总金额，不包括高龄补贴总金额) </Col>
        </Row>
        <Row class="item1">
          <Col span="3" offset="1" style="text-align: center" class="red-name">救助证编号:</Col>
          <Col span="6">
            <Input v-model="paramData.ssbg0012" placeholder=""></Input>
          </Col>
          <Col span="12" style="text-align: center" class="red-name">（请根据当前申请家庭拟满足低保或边缘户，来填写对应规则的救助证编号） </Col>
        </Row>
        <Row class="item1">
          <Col span="3" offset="1" style="text-align: center" class="red-name">开户银行名称:</Col>
          <Col span="6">
            <Input v-model="paramData.ssbg0012" placeholder=""></Input>
          </Col>
          <Col span="3" offset="1" style="text-align: center" class="red-name">开户人姓名:</Col>
          <Col span="4">
            <Input v-model="paramData.ssbg0012" placeholder=""></Input>
          </Col>
          <Col span="4" style="text-align: center" class="red-name">请填写开户人姓名！</Col>
        </Row>
        <Row class="item1">
          <Col span="3" offset="1" style="text-align: center" class="red-name">银行卡账号:</Col>
          <Col span="4">
            <Input v-model="paramData.ssbg0012" placeholder=""></Input>
          </Col>
          <Col span="4" style="text-align: center" class="red-name">请填写银行卡账号！</Col>
          <Col span="4" style="text-align: center" class="red-name">银行卡账号确认录入:</Col>
          <Col span="4">
            <Input v-model="paramData.ssbg0012" placeholder=""></Input>
          </Col>
          <Col span="4" style="text-align: center" class="red-name">请填写银行卡账号确认录入！</Col>
        </Row>
        <Row class="item1">
          <Col span="3" offset="1" style="text-align: center" class="">申请时间:</Col>
          <Col span="6">
            <DatePicker type="date" v-model="paramData.ssbg0008" placeholder="Select date" style="width: 195px"></DatePicker>
          </Col>
          <Col span="3" offset="1" style="text-align: center" class="">致贫原因:</Col>
          <Col span="6">
            <Select v-model="paramData.ssbg0001">
              <Option :value="obj.id" v-for="obj in dataF1" v-bind:key="obj.key">{{obj.azcp0003}}</Option>
            </Select>
          </Col>
        </Row>
        <Row class="item1" style="height:auto">
          <Col span="3" offset="1" style="text-align: center;" class="">救助申请理由:</Col>
          <Col span="16">
            <Input v-model="paramData.ssbg0001" type="textarea" :autosize="{minRows: 2,maxRows: 4}" placeholder=""></Input>
          </Col>
        </Row>
      </Form>
    </div>
    <div style="height:40px;line-height:40px;float:left;margin-top:10px;margin-left:40%">
      <Button type="info" @click="next()">下一步></Button>
    </div>
  </div>
</template>
<script>
import { getAppraising, createPostNew, findFamilyList } from '@/api/eventlist'
import nophoto from '@/assets/images/nophoto.jpeg'
export default {
  data () {
    return {
      membername: '',
      hostname: '',
      url: 'dbsq/addEducationInfo',
      str: this.$route.params.serialNumber,
      idcardNumber: this.$route.params.idcardNumber,
      ss11001Id: this.$route.params.ss11001Id,
      ss11002Id: this.$route.params.ss11002Id,
      columns1: [
        {
          title: '人员姓名',
          key: 'azcp0003'
        },
        {
          title: '学校名称',
          key: 'ssbg0002'
        },
        {
          title: '学习性质',
          key: 'ssbg0004'
        },
        {
          title: '入学时间',
          key: 'ssbg0007'
        },
        {
          title: '毕业时间',
          key: 'ssbg0008'
        },
        {
          title: '学历',
          key: 'ssbg0009'
        },
        {
          title: '学位',
          key: 'ssbg0010'
        },
        {
          title: '专业名称',
          key: 'ssbg0011'
        },
        {
          title: '操作',
          key: 'cardno',
          render: (h, params) => {
            return h('div', [
              h('Button', {
                props: {
                  type: 'primary',
                  size: 'small'
                },
                style: {
                  marginRight: '5px'
                },
                on: {
                  click: () => {
                    this.edit(params.index)
                  }
                }
              }, '编辑'),
              h('Button', {
                props: {
                  type: 'error',
                  size: 'small'
                },
                on: {
                  click: () => {
                    this.deletePeople(params.index)
                  }
                }
              }, '删除')
            ])
          }
        }
      ],
      paramData: {
        ssbg0001: '',
        ssbg0002: '',
        ssbg0003: '',
        ssbg0004: '',
        ssbg0005: '',
        ssbg0006: '',
        ssbg0007: '',
        ssbg0008: '',
        ssbg0009: '',
        ssbg0010: '',
        ssbg0011: '',
        ssbg0012: '',
        ssbg0013: ''
      },
      ruleValidate: {
        name: [
          { required: true, message: 'The name cannot be empty', trigger: 'blur' }
        ]
      },
      data1: [],
      data2: [],
      data3: [],
      dataF1: [],
      dataF2: [
        {
          'key': '1',
          'value': '家庭支出'
        }
      ],
      formitem1: {
        input: '',
        input1: '',
        input2: '',
        input3: '',
        input4: '',
        select: '',
        radio: 'male',
        checkbox: [],
        switch: true,
        date: '',
        time: '',
        slider: [20, 50],
        textarea: ''
      },
      modal: false,
      nophoto
    }
  },
  methods: {
    getEducationList () {
      var param1 = {
        'request_map': {
          'ss11001Id': this.$route.params.ss11001Id,
          'size': 10,
          'pageNo': 1,
          'sort': '',
          'order': ''
        },
        'headers_map': {
          'serialNumber': this.str,
          'idcardNumber': this.idcardNumber
        },
        'url': 'dbsq/queryEducationInfo'
      }
      createPostNew(param1).then(res => {
        this.data3 = res.data.data.data.educationInfo
        console.log(res, '教育情况列表')
        // console.log(this.data3)
      })
    },
    getInfo () {
      var param = {
        'idcardNumber': this.idcardNumber,
        'dictsCode': 'ss11012',
        'serialNumber': this.str
      }
      getAppraising(param).then(res => {
        this.data2 = res.data.data.data
        console.log(res, '基础数据')
        console.log(this.data2)
        // 被赡抚养人
        var param1 = {
          'ss11001Id': this.$route.params.ss11001Id,
          'size': 10,
          'pageNo': 1,
          'serialNumber': this.str,
          'idcardNumber': this.idcardNumber
        }
        findFamilyList(param1).then(res => {
          this.dataF1 = res.data.data.data.personInfo
          this.membername = '成员: '
          for (var i = 1; i < this.dataF1.length; i++) {
            this.membername = this.membername + this.dataF1[i].azcp0003 + ' '
          }
          this.hostname = '户主: ' + this.dataF1[0].azcp0003 + ' ' + this.membername
          console.log('chengyua' + this.membername)
        })
      })
    },
    ok111 (item1) {
      console.log(item1)
      console.log('~~~~')
      console.log('1id, 2id', this.$route.params.ss11001Id, this.$route.params.ss11002Id)
      var param = {
        'request_map': this.paramData,
        'headers_map': {
          'serialNumber': this.str,
          'idcardNumber': this.idcardNumber
        },
        'url': this.url
      }
      createPostNew(param).then(res => {
        console.log(res, '调用接口返回来的数据')
        alert(res.data.data.memo)
        this.getEducationList()
      })
    },
    edit (item1) {
      var obj = this.data3[item1]
      var ss11009Id = obj.id
      this.modal = true
      var param = {
        'request_map': {
          'ss11009Id': ss11009Id
        },
        'headers_map': {
          'serialNumber': this.str,
          'idcardNumber': this.idcardNumber
        },
        'url': 'dbsq/getEducationInfo'
      }
      createPostNew(param).then(res => {
        var a = res.data.data.data
        for (var obj in a) {
          if (a[obj]) {
            this.paramData[obj] = a[obj]
          } else {
            this.paramData[obj] = this.paramData[obj]
          }
        }
        // this.paramData = res.data.data.data
        delete this.paramData.id
        if (res.data.data.code === '200' || res.data.data.rescode === '1000') {
          this.url = 'dbsq/updateEducationInfo'
          this.paramData.ss11009Id = ss11009Id
        } else {
          this.url = 'dbsq/addEducationInfo'
        }
        alert(res.data.data.memo)
      })
      this.getInfo()
    },
    deletePeople (item1) {
      var obj = this.data3[item1]
      var ss11009Id = obj.id
      var delParam = {
        'request_map': {
          'ss11009Id': ss11009Id
        },
        'headers_map': {
          'serialNumber': this.str,
          'idcardNumber': this.idcardNumber
        },
        'url': 'dbsq/delEducationInfo'
      }
      createPostNew(delParam).then(res => {
        alert(res.data.data.memo)
        this.getEducationList()
      })
    },
    next () {
      console.log('下一步是家庭附件')
      this.$router.push({
        name: 'nearfamily',
        params: {
          serialNumber: this.$route.params.serialNumber,
          idcardNumber: this.$route.params.idcardNumber,
          ss11001Id: this.$route.params.ss11001Id,
          ss11002Id: this.$route.params.ss11002Id
        }
      })
    },
    changePage () {
      // The simulated data is changed directly here, and the actual usage scenario should fetch the data from the server
      this.data3 = this.getEducationList()
    }
  },
  mounted () {
    console.log(this.paramData)
    console.log('daiguolaide')
    console.log('2id' + this.$route.params.ss11002Id)
    console.log('1id' + this.$route.params.ss11001Id)
    // 列表
    this.getEducationList()
    this.getInfo()
  }
}
</script>
